<template>
  <div class="footer-nav">
    <mt-tabbar v-model="selected">
      <mt-tab-item id="首页" @click.native="goToIndex">
        <img v-if="!(selected== '首页')" src="@/assets/public/home.png" />
        <img v-if="(selected== '首页')" src="@/assets/public/home-active.png" />
        首页
      </mt-tab-item>
      <mt-tab-item id="我的" @click.native="goToAccount">
        <img v-if="!(selected== '我的')" src="@/assets/public/mine.png" />
        <img v-if="(selected== '我的')" src="@/assets/public/mine-active.png" />
        我的
      </mt-tab-item>
    </mt-tabbar>
  </div>
</template>

<script>
import { Tabbar, TabItem } from "mint-ui";
export default {
    name: "footer-nav",
    data() {
        return {
            selected: this.titles,
            islogin:true,
        };
    },
    props: {
        titles: String
    },
    created() {
        this.getuserinfo();
    },
    methods: {
        getuserinfo() {
            var url = this.$host1 + `home/getPersonalMsg`;
            this.$axios.get(url).then(res => {
                // console.log(res);
                //return
                if (res.status == 200) {
                    let resData = res.data;
                    if (resData.code == 200) {
                        
                    } else if (resData.code == 0) {
                        this.AlertWin("请先去登录！");
                        this.islogin=false
                    } else {
                        this.AlertWin(resData.message);
                    }
                }
            })
            .catch(() => {
            this.AlertWin("网络错误！请稍后重试！");
            });
        },
        goToIndex() {
            this.$router.push({ name: "ticket" });
        },
        // goToMall() {
        //     if(this.islogin==false){
        //         this.AlertWin("请先去登录！");
        //         this.$router.push('/login')
        //     }else{
        //         window.location.href = `https://test.izhixiu.cn/www/met/musicstore/#/`;
        //     }
        // },
        // goToFriend() {
        //     this.$router.push({ name: "friend" });
        // },
        // goToMine() {
        //     this.$router.push({ name: "mine" });
        // },
        goToAccount() {
            this.$router.push({ name: "ticketMine" });
        }
    }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.footer-nav {
    width: 100%;
    img {
        display: block;
    }
    .mint-tabbar {
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 1000;
        height: 1rem;
        box-sizing: border-box;
        background-color: #fff;
        img {
        width: auto;
        height: 0.4rem;
        margin: 0 auto;
        //object-fit: cover;
        margin-bottom: 0.09rem;
        }
        .mint-tab-item {
        border-top: 0.01rem solid #e9e9e9;
        font-size: 0.22rem !important;
        .mint-tab-item-label {
            color: blue !important;
            font-size: 0.22rem !important;
            line-height: 0.32rem;
        }
        }
        .is-selected {
        color: #540573;
        background-color: #fff;
        border-top: 0.01rem solid #e9e9e9;
        }
    }
}
</style>
